<!--<!DOCTYPE html>-->
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>专线电话</title>
</head>
<script type="text/javascript" src="js/jquery-3.1.0.min.js">
</script>
<script>
    function toCall(){
        var callerAcc=$("#callerAcc").val();
        var caller=$("#caller").val();
        var callee=$("#callee").val();
        var requestData="{'callerAcc':callerAcc,'caller':caller,'callee':callee}";
        alert(callerAcc);
        //校验省略
        $.ajax({
            url:"http://localhost:8080/phoneLink.do",
            type:"post",
            dataType:"json",
           // contentType:"application/json",
            data:{"callerAcc":callerAcc,"caller":caller,"callee":callee},
            //data:JSON.stringify(requestData),
            success:function(result){

               /* var jsonObj = eval("("+result.toString()+")");
                //接下来就可以使用jsonObj这个json对象取出其中的属性值，做一些修改html元素value值等操作了。
                var code=jsonObj["code"];
                if(code==200){
                    alert("电话接通，请耐心等待。。。");
                }else{
                    alert(jsonObj["msg"]);
                }*/
                //var jsonObj=eval("("+result+")");
                //接下来就可以使用jsonObj这个json对象取出其中的属性值，做一些修改html元素value值等操作了。
                var code=result["code"];
                if(code==200){
                    alert("电话接通，请耐心等待。。。");
                }else{
                    alert(result["msg"]);
                }
            },
            error:function(){
                alert("error");
            }
        })
    }
    //原生ajax写法
    function createXMLHTTPRequest() {
        //1.创建XMLHttpRequest对象
        //这是XMLHttpReuquest对象无部使用中最复杂的一步
        //需要针对IE和其他类型的浏览器建立这个对象的不同方式写不同的代码
        var xmlHttpRequest;
        if (window.XMLHttpRequest) {
            //针对FireFox，Mozillar，Opera，Safari，IE7，IE8
            xmlHttpRequest = new XMLHttpRequest();
            //针对某些特定版本的mozillar浏览器的BUG进行修正
            if (xmlHttpRequest.overrideMimeType) {
                xmlHttpRequest.overrideMimeType("text/xml");
            }
        } else if (window.ActiveXObject) {
            //针对IE6，IE5.5，IE5
            //两个可以用于创建XMLHTTPRequest对象的控件名称，保存在一个js的数组中
            //排在前面的版本较新
            var activexName = [ "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];
            for ( var i = 0; i < activexName.length; i++) {
                try {
                    //取出一个控件名进行创建，如果创建成功就终止循环
                    //如果创建失败，回抛出异常，然后可以继续循环，继续尝试创建
                    xmlHttpRequest = new ActiveXObject(activexName[i]);
                    if(xmlHttpRequest){
                        break;
                    }
                } catch (e) {
                }
            }
        }
        return xmlHttpRequest;
    }
    function post(){
        var req = createXMLHTTPRequest();
        if(req){
            req.open("post", "http://localhost:8080/phoneLink.do", true);
            req.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8;");
            //req.send("keywords=手机");
            req.send();
            req.onreadystatechange = function(){
                if(req.readyState == 4){
                    if(req.status == 200){
                        alert("success");
                    }else{
                        alert("error");
                    }
                }
            }
        }
    }
//以post方式发送数据为例
function chuFa() { //html元素事件触发的函数
    var myXMLHttpRequest = null;
    if (window.ActiveXObject) {
        myXMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
    } else {
        myXMLHttpRequest = new XMLHttpRequest();
    }
    var url = "http://localhost:8080/phoneLink.do";
    var callerAcc=document.getElementById("callerAcc").value;
    var caller=document.getElementById("caller").value;
    var callee=document.getElementById("callee").value;
    var postData = {
        "callerAcc": callerAcc,
        "caller": caller,
        "callee":callee
    };

    postData = (function(obj){ // 转成post需要的字符串.
        var str = "";

        for(var prop in obj){
            str += prop + "=" + obj[prop] + "&"
        }
        return str;
    })(postData);


    myXMLHttpRequest.open("post", url, true);
    myXMLHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    myXMLHttpRequest.send(postData);
    myXMLHttpRequest.onreadystatechange = function(){
        if (myXMLHttpRequest.readyState == 4) {
            if(myXMLHttpRequest.status == 200){
                var res = myXMLHttpRequest.responseText;
                var jsonObj = eval("("+res+")");
                //接下来就可以使用jsonObj这个json对象取出其中的属性值，做一些修改html元素value值等操作了。
                var code=jsonObj["code"];
                if(code==200){
                    alert("电话接通，请耐心等待。。。");
                }else{
                    alert(jsonObj["msg"])
                }
                //alert(jsonObj["code"]);
                //alert(jsonObj["obj"]["session"]);
            }else{
                alert("失败。。。");
            }

        }
    }

}
</script>
<body>
  <div>

     <h1>专线电话</h1>
      callerAcc: <input type="text" name="callerAcc" id="callerAcc">
      <br>
      caller: <input type="text" name="caller" id="caller">
      <br>
      callee: <input type="text" name="callee" id="callee">
      <hr>
<input type="button" id="call" onclick="toCall()" value="call...">

  </div>
</body>
</html>